<!--
2020-##-## 周# by chenchong
* ADD
-->
<template>
  <a-card :bordered="false">
    <!-- 查询区域 -->
    <div class="table-page-search-wrapper">
      <a-form layout="inline" @keyup.enter.native="searchQuery">
        <a-row :gutter="24">
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="用户账户">
              <a-input placeholder="请输入用户账户" v-model="queryParam.id"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="用户名称">
              <a-input placeholder="请输入用户名称" v-model="queryParam.username"></a-input>
            </a-form-item>
          </a-col>
           <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="所属机构">
              <a-input placeholder="请输入所属机构" v-model="queryParam.realname"></a-input>
            </a-form-item>
          </a-col>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
              <a-form-item label="状态">
                    <a-select :size="size"  style="width: 200px" @change="handleChange" placeholder=" 请选择状态" v-model="queryParam.status">
                      <a-select-option value="1">
                       正常
                      </a-select-option>
                       <a-select-option value="2" >
                       冻结
                      </a-select-option>
                    </a-select>
              </a-form-item>
          </a-col>
          <template v-if="toggleSearchStatus">
            <a-col :xl="10" :lg="10" :md="12" :sm="24">
              <a-form-item label="创建日期">
                <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择开始时间" class="query-group-cust" v-model="queryParam.createdate_begin"></j-date>
                <span class="query-group-split-cust"></span>
                <j-date :show-time="true" date-format="YYYY-MM-DD HH:mm:ss" placeholder="请选择结束时间" class="query-group-cust" v-model="queryParam.createdate_end"></j-date>
              </a-form-item>
            </a-col>
          </template>
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <span style="float: left;overflow: hidden;" class="table-page-search-submitButtons">
              <a-button type="primary" @click="searchQuery" icon="search">查询</a-button>
              <a-button type="primary" @click="searchReset" icon="reload" style="margin-left: 8px">重置</a-button>
              <a @click="handleToggleSearch" style="margin-left: 8px">
                {{ toggleSearchStatus ? '收起' : '展开' }}
                <a-icon :type="toggleSearchStatus ? 'up' : 'down'"/>
              </a>
            </span>
          </a-col>

        </a-row>
      </a-form>
    </div>
    <!-- 查询区域-END -->

    <div>
      <div class="ant-alert ant-alert-info" style="margin-bottom: 16px; margin-top:16px">
        <i class="anticon anticon-info-circle ant-alert-icon"></i> 已选择 <a style="font-weight: 600">{{ selectedRowKeys.length }}</a>项
        <a style="margin-left: 24px" @click="onClearSelected">清空</a>
      </div>
    <!-- table区域-->
      <a-table
        ref="table"
        size="middle"
        bordered
        rowKey="ID"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        :rowSelection="{fixed:true,selectedRowKeys: selectedRowKeys, onChange: onSelectChange}"
        :scroll="{x : true}"
        @change="handleTableChange">
          <span slot="actions" slot-scope="tags">
            <a-tag color="blue" v-if="tags===1">正常</a-tag>
            <a-tag color="red" v-else>冻结</a-tag>
          </span>
          <span slot="action" slot-scope="text,record">
            <a @click="authorize(record)">系统授权</a>
          </span>
      </a-table>
      <AuthorizationModal ref="authorization" :recordData="recordData"></AuthorizationModal>
    </div>
  </a-card>
</template>

<script>
  import { JeecgListMixin } from '@/mixins/JeecgListMixin'
  import JDate from '@/components/jeecg/JDate.vue'
  import { postAction,getAction} from '@/api/manage'
  import moment from 'moment'
  import AuthorizationModal from './modules/AuthorizationModal'
  export default {
    name: "IdmSystemAuthorizeList",
    mixins:[JeecgListMixin],
    components: {
      JDate,
      AuthorizationModal
    },
    data () {
      return {
        tableName: 'SYS_USER',
        description: '第三方用户管理页面',
        size: 'default',
        authorizationModal:false,
        isorter:{
          column: 'UPDATE_TIME',
          order: 'desc',
        },
        columns: [
          {
            title: '#', align:"center", dataIndex: '', width: "5rem",
            key:'rowIndex',
            customRender:function (t,r,index) {
              return parseInt(index)+1;
            }
          },
          { title:'用户账号', align:"center", dataIndex: 'USERNAME', width: "10rem"},
          { title:'用户名称', align:"center", dataIndex: 'REALNAME', width: "10rem" },
          { title:'所属机构', align:"center", dataIndex: 'ORG_CODE', width: "10rem" },
          { title:'状态', align:"center", dataIndex: 'STATUS', width: "10rem",scopedSlots: { customRender: 'actions' }},
          { title:'创建人', align:"center", dataIndex: 'CREATE_BY', width: "10rem" },
          { title:'创建时间', align:"center", dataIndex: 'CREATE_TIME', width: "10rem",
          customRender: (text) => {
            return moment(text).format('YYYY-MM-DD HH:mm:ss')
          }},
          {title: '操作', align:"center", fixed:"right",dataIndex:'action',scopedSlots: { customRender: 'action' }}
        ],
        url: {
          list: '/common/select',
        },
        dictOptions:{},
        recordData:{}
      }
    },
    computed: {
    },
    methods: {
      // override mixin
      async loadData(arg) {
        const that = this;
        if(!this.url.list){
          this.$message.error("请设置url.list属性!")
          return
        }
        //加载数据 若传入参数1则加载第一页的内容
        if (arg === 1) {
          this.ipagination.current = 1;
        }
        const params = this.getQueryParams();//查询条件
        const andCriteria = [];
        if (params.id) andCriteria.push({column: "id", operator: "eq", value: params.id});
        if (params.username) andCriteria.push({column: "username", operator: "eq", value: params.username});
        if(params.realname) andCriteria.push({column:"realname",operator:"eq",value:params.realname})
        if(params.status) andCriteria.push({column:"status",operator:"eq",value:params.status})
        if (params.createdate_begin) andCriteria.push(
          {column: "CREATE_TIME", operator: "btw", value: params.createdate_begin, secondValue: params.createdate_end});
        const reqBody = {
          table: this.tableName,
          "columnMap": {
                "ID": null,
                "USERNAME": null,
                "REALNAME": null,
                "PASSWORD": null,
                "SALT": null,
                "AVATAR": null,
                "BIRTHDAY": {"dateTimeType": "datetime"},
                "SEX": null,
                "EMAIL": null,
                "PHONE": null,
                "ORG_CODE": null,
                "STATUS": null,
                "DEL_FLAG": null,
                "ACTIVITI_SYNC": null,
                "WORK_NO": null,
                "POST": null,
                "TELEPHONE": null,
                "CREATE_BY": null,
                "CREATE_TIME": {"dateTimeType": "datetime"},
                "UPDATE_BY": null,
                "UPDATE_TIME": {"dateTimeType": "datetime"},
                "IDENTITY": null,
                "DEPART_IDS": null
              },
          "orderBy": {"CREATE_TIME": -1, "UPDATE_TIME": -1},
          "where": [{or: andCriteria}],
          "pageInfo":{pageSize: this.ipagination.pageSize, pageNo: this.ipagination.current}
        };
        const res = await postAction(this.url.list,reqBody)
        if(res.code === 2000){
          console.log("res",res.data.result)
          this.dataSource = res.data.result
          this.ipagination.total = res.data.pageInfo.count
        }
     },
      initDictConfig(){
      },
      // 授权系统
      authorize(record){
        this.$refs.authorization.openModal()
        // this.authorizationModal = true
        this.recordData = record
        console.log("this.recordData",this.recordData)

        // console.log(record)
        // let {ID,USERNAME,REALNAME} = record
        // this.$router.push({
        //   name:'IdmSystemAuthorizeListModal',
        //   params: {
        //     ID,
        //     USERNAME,
        //     REALNAME,
        //     }
        // })
      },
      handleChange(value) {

      },
    },
    created(){
      this.loadData()
    },
  }
</script>

<style>
  @import '~@assets/less/common.less';
</style>
